<template>
  <svg
    t="1682577551720"
    class="icon"
    viewBox="0 0 1024 1024"
    version="1.1"
    xmlns="http://www.w3.org/2000/svg"
    p-id="16766"
    width="200"
    height="200"
  >
    <defs>
      <linearGradient id="grad-folder" x1="0%" y1="0%" x2="100%" y2="0%">
        <stop offset="0%" :style="`stop-color:${fill?.[0]};stop-opacity:1`" />
        <stop offset="100%" :style="`stop-color:${fill?.[1]};stop-opacity:1`" />
      </linearGradient>
    </defs>
    <path
      d="M938.666667 213.333333H444.373333l-72.96-72.746666A42.666667 42.666667 0 0 0 341.333333 128H85.333333a42.666667 42.666667 0 0 0-42.666666 42.666667v682.666666a42.666667 42.666667 0 0 0 42.666666 42.666667h853.333334a42.666667 42.666667 0 0 0 42.666666-42.666667V256a42.666667 42.666667 0 0 0-42.666666-42.666667z"
      p-id="16767"
      fill="url(#grad-folder)"
    ></path>
  </svg>
</template>

<script setup lang="ts">
const { fill } = defineProps({
  fill: {
    default: () => [],
  },
})
</script>

<style lang="scss" scoped></style>
